import React, { Component } from 'react';
import {
  View,
  Text,
  StyleSheet,
} from 'react-native';
export default class Cell extends Component {
  render() {
    const { title, gapTop = 0, leftContent, rightContent } = this.props;
    return (
      <View style={{
        backgroundColor: '#fff',
        flexDirection: 'row',
        paddingLeft: 10,
        paddingRight: 10,
        justifyContent: 'space-between',
        alignItems: 'center',
        height: 40,
        borderBottomWidth: 1,
        borderBottomColor: '#e8e8e8',
        marginTop: gapTop
      }}
      >
        <View style={styles.leftContentStyle}>
          {leftContent}
          <Text>{title}</Text>
        </View>
        {rightContent}
      </View>
    )
  }
}

const styles = StyleSheet.create({
  leftContentStyle: {
    flexDirection: 'row',
    alignItems: 'center',
  }
})
